﻿<UserControl 
    x:Class="CalciumTemplateApp.OptionsView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:c="clr-namespace:DanielVaughan.Windows;assembly=Calcium.Phone"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:local="clr-namespace:CalciumTemplateApp" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    c:VisualStateUtility.VisualState="{Binding VisualState}">
    
    <Grid x:Name="ContentPanel" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <!-- Remove this blurb. -->
        <TextBlock TextWrapping="Wrap" Margin="12,0,0,24">
            Options are rendered automatically once they have been registered
            with the IUserOptionsService. There are several built-in options
            for you to use. You can, however, easily define your own types,
            and/or define specific templates for the options.
            See the AppSettings class to learn how user options are registered.
            Options are saved when the user leaves the dashboard. You can override
            this behavior by explicitly saving an option when it is modified.
        </TextBlock>
        <!-- /Remove -->
        <ListBox Grid.Row="1" ItemsSource="{Binding UserOptionGroupings}" MinWidth="480">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid HorizontalAlignment="Left" >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <!-- The IOptionCategory Title is displayed. -->
                        <TextBlock Text="{Binding Path=Key.Title}" />
                        <ListBox Grid.Row="1" ItemsSource="{Binding}" 
                                 ScrollViewer.VerticalScrollBarVisibility="Disabled"
                                 Background="Transparent">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <local:OptionTemplateSelector
                                        Content="{Binding}" 
                                        HorizontalAlignment="Stretch"
                                        HorizontalContentAlignment="Stretch" 
                                        VerticalContentAlignment="Stretch"
                                        Margin="12,0,0,12">
                                        <!-- Define templates for presenting options. 
                                             A template can be specified when creating a new UserOption. 
                                             If the data type has no associated template, 
                                             then the name of the setting type is used as the template name. -->
                                        <local:OptionTemplateSelector.Resources>
                                            <DataTemplate x:Key="Boolean">
                                                <toolkit:ToggleSwitch 
                                                    Header="{Binding UserOption.Title}"
                                                    IsChecked="{Binding Setting, Mode=TwoWay}"
                                                    Width="400" />
                                            </DataTemplate>
                                            <DataTemplate x:Key="String">
                                                <StackPanel>
                                                    <TextBlock 
                                                        Text="{Binding UserOption.Title}"                                                        
                                                        Style="{StaticResource LabelTextStyle}" />
                                                    <TextBox 
                                                        Text="{Binding Setting, Mode=TwoWay}" 
                                                        InputScope="{Binding UserOption.InputScope}"
                                                        HorizontalAlignment="Stretch"
                                                        Width="400" />
                                                </StackPanel>
                                            </DataTemplate>
                                            <!--<DataTemplate x:Key="Int"></DataTemplate>-->
                                            <!--<DataTemplate x:Key="Double"></DataTemplate>-->
                                        </local:OptionTemplateSelector.Resources>
                                    </local:OptionTemplateSelector>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

</UserControl>